<template>
  <div class="inquiry-contianer">
    <div class="contact-info">
      <el-card class="box-card" style="margin: 30px 50px;">
        <div slot="header" class="clearfix contact-info-header">
          <span>联系人资料</span>
        </div>
        <el-form ref="contactForm" :inline="true" :model="contactForm" label-width="190px">
          <el-form-item label="联系人">
            <el-input v-model="contactForm.contactName" placeholder="联系人" />
          </el-form-item>
          <el-form-item label="联系人电话">
            <el-input v-model="contactForm.contactPhone" placeholder="联系电话" />
          </el-form-item>
          <el-form-item label="业务归属银行">
            <el-select v-model="contactForm.bank" placeholder="业务归属银行" value="">
              <el-option
                v-for="item in bankOptions"
                :key="item.value"
                :label="item.label"
                :value="item.value"
              />
            </el-select>
          </el-form-item>
          <el-form-item label="银行业务员">
            <el-select v-model="contactForm.salesman" placeholder="银行业务员" value="">
              <el-option
                v-for="item in salesmanOptions"
                :key="item.value"
                :label="item.label"
                :value="item.value"
              />
            </el-select>
          </el-form-item>
        </el-form>
      </el-card>
      <div class="inquiry-content">
        <div class="box-card" style="margin: 30px 50px; box-shadow: 0 2px 4px rgba(0, 0, 0, .12), 0 0 6px rgba(0, 0, 0, .04)">
          <div class="clearfix contact-info-header" style="padding: 18px 20px;border-bottom: 1px solid #e6ebf5;">
            <span>标的物详情</span>
          </div>
          <div class="inquiry-input" style="width: 400px; margin-top: 20px; padding-bottom: 20px">
            <el-form ref="inquiryForm" :model="inquiryForm" label-width="190px" size="small">
              <el-form-item label="估价目的">
                <el-select v-model="inquiryForm.inquiryDes" placeholder="估价目的" value="">
                  <el-option
                    v-for="item in salesmanOptions"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value"
                  />
                </el-select>
              </el-form-item>
              <el-form-item label="标的物类型">
                <el-select v-model="inquiryForm.objectType" placeholder="标的物类型" value="">
                  <el-option
                    v-for="item in salesmanOptions"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value"
                  />
                </el-select>
              </el-form-item>
              <el-form-item label="标的物子类型">
                <el-select v-model="inquiryForm.objectSubType" placeholder="标的物子类型" value="">
                  <el-option
                    v-for="item in salesmanOptions"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value"
                  />
                </el-select>
              </el-form-item>
              <el-form-item label="楼盘名称">
                <el-input v-model="inquiryForm.buildingDishName" placeholder="楼盘名称" />
              </el-form-item>
              <el-form-item label="楼栋名称">
                <el-input v-model="inquiryForm.buildingName" placeholder="楼栋名称" />
              </el-form-item>
              <el-form-item label="房号名称">
                <el-input v-model="inquiryForm.roomIdName" placeholder="房号名称" />
              </el-form-item>
              <el-form-item label="楼盘地址">
                <el-input v-model="inquiryForm.buildingAddress" placeholder="楼盘地址" />
              </el-form-item>
              <el-form-item label="建筑年代">
                <el-input v-model="inquiryForm.buildingAge" placeholder="建筑年代" />
              </el-form-item>
              <el-form-item label="地上总层数">
                <el-input v-model="inquiryForm.floorCounts" placeholder="地上总层数" />
              </el-form-item>
              <el-form-item label="产权房在楼层">
                <el-input v-model="inquiryForm.floor" placeholder="产权房在楼层" />
              </el-form-item>
              <el-form-item label="建筑面积">
                <el-input v-model="inquiryForm.constructionArea" placeholder="建筑面积" />
              </el-form-item>
              <el-form-item label="装修情况">
                <el-select v-model="inquiryForm.decorationSituation" placeholder="装修情况" value="">
                  <el-option
                    v-for="item in decorationSituationOptions"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value"
                  />
                </el-select>
              </el-form-item>
              <el-form-item label="朝向">
                <el-select v-model="inquiryForm.orientation" placeholder="朝向" value="">
                  <el-option
                    v-for="item in orientationOptions"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value"
                  />
                </el-select>
              </el-form-item>
              <el-form-item label="有无电梯">
                <el-select v-model="inquiryForm.elevator" placeholder="有无电梯" value="">
                  <el-option
                    v-for="item in elevatorOptions"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value"
                  />
                </el-select>
              </el-form-item>
              <el-form-item label="查勘联系人" :inline="true">
                <el-input v-model="inquiryForm.surveyorName" placeholder="姓名" style="width: 100px" />
                <el-input v-model="inquiryForm.surveyorContact" placeholder="电话" style="width: 100px" />
              </el-form-item>
            </el-form>
          </div>
        </div>
      </div>

    </div>
  </div></template>

<script>
export default {
  name: 'Index',
  data() {
    return {
      contactForm: {
        contactName: '',
        contactPhone: '',
        bank: '',
        salesman: ''
      },
      inquiryForm: {
        inquiryDes: '',
        objectType: '',
        objectSubType: '',
        buildingDishName: '',
        buildingName: '',
        roomIdName: '',
        buildingAddress: '',
        buildingAge: '',
        floorCounts: '',
        floor: '',
        constructionArea: '',
        decorationSituation: '',
        orientation: '',
        elevator: '',
        surveyorName: '',
        surveyorContact: ''
      },
      bankOptions: [{ label: '中国银行', value: '中国银行' }, { label: '中国建设银行', value: '中国建设银行' }, { label: '招商银行', value: '招商银行' }],
      salesmanOptions: [{ label: 'zxx', value: 'zxx' }, { label: '123', value: '123' }, { label: '1234', value: '1234' }],

      decorationSituationOptions: [{ label: '毛坯', value: '毛坯' }, { label: '精装修', value: '精装修' }],
      orientationOptions: [{ label: '东', value: '东' }, { label: '南', value: '南' }, { label: '北', value: '北' }, { label: '西', value: '西' }],
      elevatorOptions: [{ label: '有', value: true }, { label: '无', value: false }]
    }
  }
}
</script>

<style scoped>

</style>
